
<!doctype html>
<html class="no-js">
<#include "../../common/header.ftl">
<link rel="stylesheet" href="${basePath}/plugins/zTree/zTreeStyle.css">
<script src="${basePath}/js/role/edit.js?v=201711021700"></script>
<script src="${basePath}/plugins/zTree/jquery.ztree.core.js?v=201711021700"></script>
<script src="${basePath}/plugins/zTree/jquery.ztree.excheck.js?v=201711021700"></script>
<head>
<meta charset="UTF-8">
<title>编辑角色</title>
<style>
	.foot{
		margin-top: 5%;
    	margin-left: 10%;
	}
	.lable_text{
		padding:0px 8px;
	}
	.hide{
		display:none;
	}
	.hide{
		display:none;
	}
	body .layui-layer-content{overflow: 'visible'}
	.zTreeDemoBackground{
		margin: 2% 5%;
	}
</style>
</head>
<body>
<form class="layui-form " action="#" >
<div class="layui-tab tab-div">
  <ul class="layui-tab-title">
    <li class="layui-this">基础信息</li>
    <li>权限信息</li>
  </ul>
  <div class="layui-tab-content " >
    <div class="layui-tab-item layui-show">
    	<div class="layui-form-item">
			<label class="layui-form-label" style="width:100px;">角色名称*</label>
			<div class="layui-input-block">
				<input type="text"	name="roleName" required="" lay-verify="required"
					placeholder="请输入角色名称" value="${role.name!}" autocomplete="off" class="layui-input">
			</div>
		</div>
    	<div class="layui-form-item">
			<label class="layui-form-label" style="width:100px;">备注</label>
			<div class="layui-input-block">
					<input type="text"	name="remark" required="" lay-verify="required"
					placeholder="请输入备注" value="${role.remark!}" autocomplete="off" class="layui-input">
			</div>
		</div>
    </div>
    <div class="layui-tab-item ">
		<div class="zTreeDemoBackground">
			<ul id="permission-tree" class="ztree">
			
			</ul>
		</div>
	</div>
  </div>
</div>
</form>
<div style="margin-left: 100px;margin-bottom:30px;">
<button type="button" class="layui-btn layui-btn-normal" style="margin-left: 100px;" id="save-button"><i class="layui-icon">&#xe605;</i>保存</button>
<button type="button" class="layui-btn layui-btn-normal" style="margin-left: 50px;" id="close-button"><i class="layui-icon">&#x1006;</i>关闭</button>
</div>
<script type="text/javascript">
var basePath="${basePath}";
var imgUrl="${imgUrl}";
var init={
	roleId:"${role.id!}"
	
}
layui.use(['form','element','layer'],function(){
  var form = layui.form();
  var layer = layui.layer;
  element = layui.element(); //Tab的切换功能，切换事件监听等，需要依赖element模块
});
</script>

<script type="text/javascript">
	var setting = {
		check: {
			autoCheckTrigger: true,
			enable: true,
			chkStyle: "checkbox",
			chkboxType: { "Y": "ps", "N": "ps" }
		},
		data: {
			key: {
				id:'id',
				name: "name",
				type:'type',
				checked:'checked'
			}
		}
	};
	var zNodes=${menuList!};
	
	var code;
	
	function showCode(str) {
		if (!code) code = $("#code");
		code.empty();
		code.append("<li>"+str+"</li>");
	}
	
	$(document).ready(function(){
		$.fn.zTree.init($("#permission-tree"), setting, zNodes);
	});
</script>
</body>
</html>
